<template>
	<swiper class="banner-container" autoplay interval="1500">
		<swiper-item v-for="(item,index) in data.bannerList" :key="index">
			<image :src="item.pic_url" mode="aspectFit" @tap="goDetail(item.link_url)" />
		</swiper-item>
	</swiper>
</template>

<script>
	import {onMounted,reactive} from 'vue'
	import global from '../../config/global.js'
	export default{
		name:"Banner",
		setup(){
			let data = reactive({
				bannerList:[]
			})
			
			onMounted(()=>{
				getData();
			})
			
			function getData(){
				uni.request({
					url:global.BASE_URL+'/banner/catch/all',
					method:"GET",
					success: (res) => {
						if(res.data.code){
							data.bannerList = res.data.data
						}
					},
					fail:(err)=>{
						console.log(err)
					}
				})
			}
			
			function goDetail(value){
				uni.navigateTo({
					url:"/pages/notice/notice-detail?noticeUrl="+value
				})
			}
			
			return {
				data,
				goDetail
			}
		}
	}
</script>

<style scoped>
	.banner-container{
		width: 750rpx;
		height: 400rpx;
		text-align: center;
		background-color: #cdcdcd;
	}
	
	image{
		height: 400rpx;
		margin-left: auto;
	}
</style>